$(function (){
    //搜索框
    $('#keyword').on('keyup',function (){
        var keyword=$(this).val();

        var userid="ACID"
        if(keyword !== ''&&keyword !== null)
        {
            $.ajax({
                type   :'GET',
                url    :'/ProductPage/search?keyword='+keyword+'&userid='+userid,
                success :function(data){
                    console.log(data);
                    var productListHTML = '';
                    for(var i = 0;i < data.length;i++){
                        productListHTML += '<li class="productAutoItem"  data-productId="'+data[i].productId+'"  data-userId="'+data[i].userid+'"> '
                        productListHTML += data[i].name;
                        productListHTML += '<input class="user_Id" value="'+data[i].userid+'" hidden><input class="product_Id" value="'+data[i].productId+'" hidden></li>';
                        console.log(data[i].name);
                    }
                    $('#productAutoList').html(productListHTML);
                    $('#productAutoComplete').show();
                },
                error  :function (errorMsg){
                    console.log(errorMsg);
                }
            })
        }else{
            $('#productAutoComplete').hide();
        }
    });


//点击搜索框中内容，显示商品详情
    $('#productAutoComplete').on('click','.productAutoItem',function(){
        var userId=$(this).find('.user_Id').val();
        var productId=$(this).find('.product_Id').val();
        $('#productAutoComplete').hide();
        $('#keyword').val('');
        window.location.href = 'http://localhost:8080/productUpdate?productId=' +productId+'&userId='+userId;
    });

//移出某个范围，清空搜索框
    $('.nav_search').on('mouseleave',function(){
        $('#productAutoComplete').hide();
        //要不要把搜索框清空？
    });

    // //表单修改
    // $('#floatingWindow').on('submit','#product-update',function (e){
    //     e.preventDefault();
    //     console.log("update submit");
    //
    //     var image_context=$('#image-context')[0].src;
    //     var userId_context=$('#userId-context').val();
    //     var productName_context=$('#productName-context').val();
    //     var productPrice_context=$('#productPrice-context').val();
    //     var productId_context=$('#productId-context').val();
    //     var product_quantity=$('#productQuantity-context').val();
    //     var product_description=$('#productDescn-context').val();
    //     var product={
    //         "image":image_context,
    //         "userId":userId_context,
    //         "productName":productName_context,
    //         "productPrice":productPrice_context,
    //         "productId":productId_context,
    //         "description":product_description,
    //         "quantity":product_quantity
    //     }
    //
    //     $.ajax({
    //         type : 'POST',
    //         url : '/ProductPage/check',
    //         data:product,
    //         success: function(data) {
    //             console.log("success update");
    //
    //             var productHtML = '';
    //             $('#'+product.productId+'').html(productHtML);
    //             console.log(product.image);
    //             productHtML += '<td class="userId" hidden>'+product.userId+'</td><td class="cell-img">\n' +
    //                 '                                <img src="'+product.image+'"  class="product-img">\n' +
    //                 '                            </td>\n' +
    //                 '                            <td  class="cell-item" >'+product.productId+'</td>\n' +
    //                 '                            <td  class="cell-product">'+product.productName+'</td>\n' +
    //                 '                            <td  class="cell-description">'+product.description+'</td>\n' +
    //                 '                            <td  class="cell-quantity">'+product.quantity+'</td>'+
    //                 '                            <td  class="cell-price">'+product.productPrice+'</td>\n' +
    //                 '                            <td  class="cell-setting">\n' +
    //                 '                                <div class="submit-content">\n' +
    //                 '                                        <span class="btn order-submit">\n' +
    //                 '                                            <div class="context">删除商品</div>\n' +
    //                 '                                        </span>\n' +
    //                 '                                </div>\n' +
    //                 '                            </td>';
    //             $('#'+product.productId+'').html(productHtML);
    //             console.log($('#'+product.productId+''))
    //             // $('#productList').html(productListHTML);
    //             $('#floatingWindow').hide();
    //             $('#whole').hide();
    //         },
    //         error:function(errorMsg){
    //             console.log(errorMsg);
    //         }
    //     });
    // });

//删除操作
    $('#productList').on('click','.submit-content',function (){
        var productId=$(this).parent('.cell-setting').siblings('.cell-item').text();
        var product={
            userId:$('#'+productId+' td[class="userId"]').text(),
            productId:productId
        }
        console.log(product);
        $.ajax({
            type : 'POST',
            url : '/ProductPage/delete',
            data:product,
            success: function(data) {
                console.log("success delete");
                $('#'+productId+'').remove();
            },
            error:function(errorMsg){
                console.log(errorMsg);
            }
        });


    });

// //新增操作
//     $('.address-add').on('click',function(){
//         //图片要上传，(productId,userid)唯一，userid唯一，price和name有用户输入且不为空
//         var product={
//             image:'https://img13.360buyimg.com/seckillcms/s280x280_jfs/t1/221578/17/13805/86144/63b6846bF3317f90e/ab91e3474a5acd7f.jpg',
//             userid:'ACID',
//             price:'',
//             name:'',
//             quantity:1,
//             description:''
//         }
//         console.log("click");
//         productAdd(product);
//     });
//
//
//     $('#floatingWindow').on('submit','#product-add',function (e){
//         e.preventDefault();
//         console.log("add submit");
//
//         var image_context=$('#image-context')[0].src;
//         var userId_context=$('#userId-context').val();
//         var productName_context=$('#productName-context').val();
//         var productPrice_context=$('#productPrice-context').val();
//         var product_quantity=$('#productQuantity-context').val();
//         var product_description=$('#productDescn-context').val();
//
//         var product={
//             "image":image_context,
//             "userId":userId_context,
//             "productName":productName_context,
//             "productPrice":productPrice_context,
//             "description":product_description,
//             "quantity":product_quantity
//         }
//
//         $.ajax({
//             type : 'POST',
//             url : '/ProductPage/addProduct',
//             data:product,
//             success: function(data) {
//                 console.log("success add");
//
//                 var productHtML = '';
//                 productHtML += '<tr id="'+data.productId+'"><td class="userId" hidden>'+product.userId+'</td><td class="cell-img">\n' +
//                     '                                <img src="'+data.image+'"  class="product-img">\n' +
//                     '                            </td>\n' +
//                     '                            <td  class="cell-item" >'+data.productId+'</td>\n' +
//                     '                            <td  class="cell-product">'+data.name+'</td>\n' +
//                     '                            <td  class="cell-description">'+data.description+'</td>\n' +
//                     '                            <td  class="cell-quantity">'+data.quantity+'</td>'+
//                     '                            <td  class="cell-price">'+data.price+'</td>\n' +
//                     '                            <td  class="cell-setting">\n' +
//                     '                                <div class="submit-content">\n' +
//                     '                                        <span class="btn order-submit">\n' +
//                     '                                            <div class="context">删除商品</div>\n' +
//                     '                                        </span>\n' +
//                     '                                </div>\n' +
//                     '                            </td></tr>';
//                 $('#column').after(productHtML);
//                 productList.push(data);
//                 $('#floatingWindow').hide();
//                 $('#whole').hide();
//             },
//             error:function(errorMsg){
//                 console.log(errorMsg);
//             }
//         });
//     });
//
//
//     $('#productList').on('click','.cell-item',function (){
//         var productId = $(this).text();
//
//         var product;
//         for(var i=0;i<productList.length;i++){
//             if(productId===productList[i].productId){
//                 product=productList[i];
//             }
//         }
//         product.image=$('#'+product.productId+' img')[0].src;
//         product.name=$('#'+product.productId+' td[class="cell-product"]').text();
//         product.price=$('#'+product.productId+' td[class="cell-price"]').text();
//         product.description=$('#'+product.productId+' td[class="cell-description"]').text();
//         product.quantity=$('#'+product.productId+' td[class="cell-quantity"]').text();
//         console.log(product.image);
//         console.log(product);
//         productUpdate(product);
//     });
//
//     $('#floatingWindow').on('click','.cancel',function (){
//         $('#floatingWindow').find('#productName-context').val('');
//         $('#floatingWindow').find('#productDescn-context').val('');
//         $('#floatingWindow').find('#productQuantity-context').val('');
//         $('#floatingWindow').find('#productQuantity-context').val('');
//         $('#floatingWindow').hide();
//         $('#whole').hide();
//     });





});

// function productAdd(product){
//     var tableHTML = '';
//     $('#floatingWindow').html(tableHTML);
//     tableHTML += '<form id="product-add">'
//     tableHTML += '<table class="product-table-info">\n' +
//         '            <tr>\n' +
//         '                <th class="cell-img">&nbsp;</th>\n' +
//         '                <th class="cell-product">Product Name</th>\n' +
//         '                <th class="cell-description">Description</th>\n'+
//         '                <th class="cell-quantity">Quantity</th>\n'+
//         '                <th class="cell-price">List Price</th>\n' +
//         '                <th class="cell-img">&nbsp;</th>\n' +
//         '                <th class="cell-img">&nbsp;</th>\n' +
//         '            </tr>';
//     tableHTML += '<input id="userId-context" value="'+product.userid+'" hidden>'
//     tableHTML += '<input id="productId-context" value="'+product.productId+'" hidden>'
//     tableHTML += '<tr >\n' +
//         '                <td class="cell-img">\n' +
//         '                    <a href="#">';
//     tableHTML += '<img src="'+product.image+'" class="product-img" id="image-context">';
//     tableHTML += '</a>\n' + '</td>\n';
//
//     tableHTML += '<td class="cell-product">';
//     tableHTML += '<input type="text"  value="'+product.name+'" id="productName-context">';
//     tableHTML += '</td>\n' +'<td class="cell-descn"><input type="text"  value="'+product.description+'" id="productDescn-context"></td>'+
//         '<td class="cell-quantity"><input type="text"  value="'+product.quantity+'" id="productQuantity-context"></td>'+
//         '                <td class="cell-price">';
//     tableHTML += '<input type="text" value="'+product.price+'" id="productPrice-context">'+'</td>\n'+'<td>\n';
//
//     tableHTML += '<button type="submit" class="ProductAdd">新增</button>'
//     tableHTML += '<button type="button" class="cancel">取消</button>'+
//         '               </td>\n' +
//         '            </tr>\n' +
//         '        </table>';
//
//     tableHTML += '</form>'
//     $('#floatingWindow').html(tableHTML);
//     $('#whole').show();
//     $('#floatingWindow').show();
// }
//
// function productUpdate(product){
//     var tableHTML = '';
//     $('#floatingWindow').html(tableHTML);
//     tableHTML += '<form id="product-update">'
//     tableHTML += '<table class="product-table-info">\n' +
//         '            <tr>\n' +
//         '                <th class="cell-img"><input type="file" id="file"></th>\n' +
//         '                <th class="cell-item">Product ID</th>\n' +
//         '                <th class="cell-product">Product Name</th>\n' +
//         '                <th class="cell-description">Description</th>\n'+
//         '                <th class="cell-quantity">Quantity</th>\n'+
//         '                <th class="cell-price">List Price</th>\n' +
//         '                <th class="cell-img">&nbsp;</th>\n' +
//         '                <th class="cell-img">&nbsp;</th>\n' +
//         '            </tr>';
//     tableHTML += '<input id="userId-context" value="'+product.userid+'" hidden>'
//     // tableHTML += '<input id="image-context" value="'+product.image+'" hidden>'
//     tableHTML += '<input id="productId-context" value="'+product.productId+'" hidden>'
//
//     tableHTML += '<tr >\n' +
//     '                <td class="cell-img">\n' +
//     '                    <a href="#">';
//     tableHTML += '<img src="'+product.image+'" class="product-img" id="image-context">';
//
//     tableHTML += '</a>\n' +
//         '                </td>\n' +
//         '                <td class="cell-item">';
//     tableHTML += product.productId;
//     tableHTML += '</td>\n' +
//         '                <td class="cell-product">';
//     tableHTML += '<input type="text"  value="'+product.name+'" id="productName-context">';
//     tableHTML += '</td>\n' +'<td class="cell-descn"><input type="text"  value="'+product.description+'" id="productDescn-context"></td>'+
//         '<td class="cell-quantity"><input type="text"  value="'+product.quantity+'" id="productQuantity-context"></td>'+
//         '                <td class="cell-price">';
//     tableHTML += '<input type="text" value="'+product.price+'" id="productPrice-context">'+'</td>\n'+'<td>\n';
//
//     tableHTML += '<button type="submit" class="ProductSave">保存</button>'
//     tableHTML +=
//         '               </td>\n' +
//         '            </tr>\n' +
//         '        </table>';
//
//     tableHTML += '</form>'
//     $('#floatingWindow').html(tableHTML);
//     $('#whole').show();
//     $('#floatingWindow').show();
// }